<template>
  <div class="MapviewContentvideo">
    <!--中心监控视频页面 -->
    <div class="title-view">
      <titleBg> </titleBg>
      <div class="title-item major">危化品车位</div>
      <titleBg> </titleBg>
      <div class="title-item">全景</div>
      <titleBg> </titleBg>
      <div class="title-item">小型车通道</div>
    </div>
    <div style="padding-top:70px">
      
      <video id="videos" muted="muted" width="100%" :src="videoSrc" autoplay="autoplay" loop></video>

    </div>
  </div>
</template>

<script>
import titleBg from "./titleBg" //左一 报警信息
export default {
  name: 'MapviewContentvideo',
  components: {
    titleBg
  },
  data() {
    return {
      videoSrc: require("../../assets/video/video.mp4")
    };
  },

  mounted() {
    
  },

  methods: {
    
  },
};
</script>
<style  scoped>
  .title-view{
    display: flex;
    position: absolute;
  }
  .title-item{
    width: 226px;
    height: 52px;
    line-height: 52px;
    background: #163561;
    text-align: center;
    position:relative;
    left:-230px;
    top:5px;
    display:inline;
    font-size: 26px;
    text-shadow: 2px 2px 2px #fff;
  }
  .major{
    color: #FFA100;
    text-shadow: 2px 2px 2px #163561;
    font-weight: bold;
    background: linear-gradient(45deg, rgba(128,168,218, 0.8) 0%, rgba(128,168,218, 0.1) 100%)  ;
  }
  video{
    height:calc(100% - 130px)
  }
</style>
